<h:panelGroup xmlns:h='http://java.sun.com/jsf/html'
              xmlns:f='http://java.sun.com/jsf/core'
              xmlns:p='http://primefaces.org/ui'
              xmlns:z='http://savanti.com.bo/ui'
              xmlns:x='http://java.sun.com/jsf/composite/ui/component' styleClass='IIKardex' id='IIKardex'><p:growl/>

<p:toolbar styleClass='toolBar'><p:toolbarGroup style='width:100%'>

<p:commandButton icon='ui-icon-new'  title='Nuevo'  actionListener='#{IIKardex.uiClean}' update='@(.IIKardex)' style='border:none; float:left;  width:70px'/>

<p:commandButton icon='ui-icon-find' title='Buscar' actionListener='#{IIKardex.uiFind}'  update='@(.IIKardex)' style='border:none; float:right; width:70px'/>

</p:toolbarGroup></p:toolbar>


<h:panelGroup>

  <h:panelGrid columns='2' cellpadding='8' width='100%'>

  <x:materialImage c='#{IIKardex.material.id}' t='V. #{IIKardex.material.valuacion}'/>

  <h:panelGrid columns='1' cellpadding='3' style='float: right'>

  <x:fieldL b='#{IIKardex}' t='Almacen'  v='#{IIKardex.almacenId}'/>

  <x:fieldM b='#{IIKardex}' t='Material' v='#{IIKardex.material}' x='#{x}'/>

  <x:fieldD b='#{IIKardex}' t='Desde'    v='#{IIKardex.dateIni}' w='70px'/>

  <x:fieldD b='#{IIKardex}' t='Hasta'    v='#{IIKardex.dateEnd}' w='70px'/>

  </h:panelGrid>

  </h:panelGrid>

</h:panelGroup>


<p:dataTable value='#{IIKardex.lsEntity}' var='x' rendered='#{not empty IIKardex.lsEntity}' resizableColumns='true'>

  <p:columnGroup type='header'>

  <p:row>
  <p:column colspan='3' headerText='Cantidad'                                          style='width:195px'/>
  <p:column rowspan='2' headerText='Costo'      sortBy='#{x.saldoCosto}'               style='width: 45px'/>
  <p:column colspan='3' headerText='Valor'                                             style='width:195px'/>
  <p:column rowspan='2' headerText='Fecha'      sortBy='#{x.fecha}'                    style='width: 90px' filterStyleClass='columnFind' filterBy='#{x.fecha}'/>
  <p:column rowspan='2' headerText='Persona'    sortBy='#{x.persona.nombre}'                               filterStyleClass='columnFind' filterBy='#{x.persona.nombre}'/>
  <p:column rowspan='2' headerText='Motivo'     sortBy='#{x.movimiento.motivo.nombre}' style='width:50px'  filterStyleClass='columnFind' filterBy='#{x.movimiento.motivo.nombre}'/>
  <p:column rowspan='2' headerText='Doc Ref'    sortBy='#{x.movimiento.documento}'     style='width:50px'  filterStyleClass='columnFind' filterBy='#{x.movimiento.documento}'/>
  <p:column rowspan='2' headerText='Movimiento' sortBy='#{x.movimiento.id}'            style='width:65px'/>
  </p:row>

  <p:row>
  <p:column headerText='Ingreso' sortBy='#{x.entradaCantidad}'/>
  <p:column headerText='Egreso'  sortBy='#{x.salidaCantidad}'/>
  <p:column headerText='Saldo'   sortBy='#{x.saldoCantidad}'/>

  <p:column headerText='Ingreso' sortBy='#{x.entradaValor}' style='width:20px'/>
  <p:column headerText='Egreso'  sortBy='#{x.salidaValor}'  style='width:20px'/>
  <p:column headerText='Saldo'   sortBy='#{x.saldoValor}'   style='width:20px'/>
  </p:row>
      
  </p:columnGroup>

  <p:column><z:outputN v='#{x.entradaCantidad}' r='0'/></p:column>

  <p:column><z:outputN v='#{x.salidaCantidad}'  r='0'/></p:column>

  <p:column><z:outputN v='#{x.saldoCantidad}'   r='0'/></p:column>

  <p:column><z:outputN v='#{x.saldoCosto}'/>  </p:column>

  <p:column><z:outputN v='#{x.entradaValor}'/></p:column>

  <p:column><z:outputN v='#{x.salidaValor}'/> </p:column>

  <p:column><z:outputN v='#{x.saldoValor}'/>  </p:column>

  <p:column><h:outputText value='#{x.fecha}' style='white-space:normal'><f:convertDateTime pattern='dd-MM-yyyy HH:mm'/></h:outputText></p:column>

  <p:column> <h:outputText value='#{x.persona.nombre}' title='Almacenero #{x.movimiento.almacenero.usuario.persona.nombre}'/></p:column>

  <p:column> <h:outputText value='#{x.movimiento.motivo.nombre}' title='#{x.movimiento.descripcion}'/></p:column>

  <p:column> <h:outputText value='#{x.movimiento.documento}'/></p:column>

  <p:column><z:outputN v='#{x.movimiento.id}' r='0'/></p:column>

</p:dataTable>

</h:panelGroup>   